<!--头-->
<style scoped>
  .headWrap {
    z-index: 1;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 3.4rem;
  }
  .head {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    height: 2.2rem;
    line-height: 2.2rem;
    background: url("../assets/images/components/navBg.png") no-repeat;
    background-size: cover;
    color: #fff;
    padding: 0 .75rem;
    font-size: .9rem; /*px*/
  }
  .backImg {
    flex: 0 0 15%;
    height: 2.2rem;
    line-height: 2.2rem;
    text-align: left;
    background: url('../assets/images/back.png') no-repeat left center;
    background-size: .6rem 1.1rem;
  }
  .centerInfo {
    text-align: center;
    flex:  0 0 70%;
  }
  .week {
    display: flex;
    width: 100%;
    padding: 0 .5rem;
    box-sizing: border-box;
    background-color: #fff;
    font-size: .7rem;
    line-height: 1.2rem;
    height: 1.2rem;
    background-color: #7cc7f3;
    color: #fff;
  }
  .week div {
    -webkit-flex: 1;
    flex: 1;
    text-align: center;
  }
  .dateBox {
    padding: 3.4rem .5rem 1rem .5rem;
    line-height: 1.5rem;
    font-size: .8rem; /*px*/
    height: 100%;
    box-sizing: border-box;
    overflow: auto;
    box-sizing: border-box;
  }


</style>

<!--日期-->
<style scoped>
  .myDatePicker {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    background-color: #fff;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }
  .myDatePicker ::-webkit-scrollbar {
    display: none;
  }
  .monthTitle {
    margin-top: .5rem;
    text-align: center;
  }
  .month {
    padding-bottom: 1rem;
  }
  .rightInfo {
    flex:  0 0 15%;
  }
  .days {
    width: 100%;
  }
  .day {
    box-sizing: border-box;
    width: 14.2857143%;
    height: 1.675rem;
    line-height: 1.675rem;
    margin: .5rem 0;
    float: left;
    text-align: center;
  }
  .days .day:nth-child(7n) {
    color: #63bced;
  }
  .days .day:nth-child(7n+1) {
    color: #63bced;
  }
  .dayActive {
    background-color: #0094db;
    color: #fff!important;
    border-radius: 50%;
    position: relative;
  }
  .dayruzhu {
    background-color: #fff;
    color: #ccc;
  }
  .dayKong {
    background-color: #fff;
  }

  .no {
    color: #ccc!important;
  }

  .dayActive .tipDiv {

  }
</style>

<!--主题动画-->
<style scoped>
  .fade-enter-active, .fade-leave-active {
    transition: all 0.5s ease;
  }

  .fade-enter, .fade-leave-active {
    opacity: 0;
    transform: translateY(7.5rem);
  }
</style>

<!--toast-->
<style scoped>
  .toast {
    position: fixed;
    bottom: .5rem;
    background-color: rgba(0, 0, 0, 0.3);
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    font-size: .75rem; /*px*/
    padding: .375rem .5rem;
    color: #fff;
    border-radius: .25rem;
    z-index: 9999;
  }
  .tipDivStart {
    font-size: .65rem;
  }
</style>

<!-- toast 动画-->
<style scoped>
  .toast-enter-active, .toast-leave-active {
    transition: all 0.2s ease;
  }

  .toast-enter, .toast-leave-active {
    opacity: 0.5;
    transform: translateX(7.5rem);
  }
</style>


<template>
  <transition name="fade">
    <div class="myDatePicker">
      <div class="headWrap">
        <div class="head fix">
          <a href="javascript:;" class="backImg" @click="dateBack"></a>
          <div class="centerInfo" v-text="centerInfo" @click="centerClick"></div>
          <div class="rightInfo" v-text="rightInfo" @click="rightClick"></div>
        </div>
        <div class="week fix">
          <div class="weekend">日</div>
          <div>一</div>
          <div>二</div>
          <div>三</div>
          <div>四</div>
          <div>五</div>
          <div class="weekend">六</div>
        </div>
      </div>
      <div class="dateBox">
        <div class="year" v-for="(item,index) in years" @click="yearClick($event,index)">
          <div class="month" v-for="(item,index) in years[index].dateYear" @click="monthClick($event,index)">
            <div class="monthTitle">{{item.year}}年{{item.month}}月</div>
            <div class="fix days">
              <div class="day" v-for="(itemDay,index) in item.days" @click="dayClick($event,index)"
                   :time="item.year + '-'+ item.month + '-' + itemDay.day" ref="day"
                   @touchend="dayClickEnd" :class="{no:itemDay.no}">{{itemDay.day}}
              </div>
            </div>
          </div>
        </div>
      </div>
      <transition name="toast">
        <div class="toast" v-show="toastShow">
          {{toastInfo}}
        </div>
      </transition>
    </div>
  </transition>
</template>
<script>
  var currentTime = new Date();
  var currentYear = currentTime.getFullYear();
  var currentMonth = currentTime.getMonth() + 1;
  var currentDate = currentTime.getDate();
  var currentDay = currentTime.getDay();
  var currentMinWeek;

  if (currentMonth < 10) {
    currentMonth = '0' + currentMonth
  }

  if (currentDate < 10) {
    currentDate = '0' + currentDate
  }

  export default{
    data(){
      return {
        toastShow: true,
        jintian: '',
        yearIndex: 0,
        monthIndex: 0,
        dayIndex: 0,
        toastInfo: '',
        years: [],
        selDay: '',
        selMonth: '',
        selYear: '',
        selTime: '',
        startTime: '',
        endTime: '',
        click: 'one',
        dayEvent: '',
        upOpen: true
      }
    },
    props: {
      centerInfo: {default: '选择入住离店日期'},
      tipDivTextStart: {default: '入住'},
      tipDivTextEnd: {default: '离店'},
      toastInfoArr:{
        type:Array,
        default:function(){
          return ['选择入住日期','选择离店日期']
        }
      },
      rightInfo: {default: ''},
      start: {default: ''},
      end: {default: ''},
      min: {default: currentYear + '-' + currentMonth + '-' + currentDate},//今天
      maxProp: {default: currentYear + 1 + '-' + currentMonth + '-' + currentDate},//一年
    },
    methods: {
      num9(num){
        num = parseInt(num);
        if (num < 10) {
          num = '0' + num;
          return num;
        } else {
          return num;
        }
      },
      yearClick(e, index){
        if (e.target.className == 'day no') {
          return;
        }
        if (e.target.className == 'day' || e.target.className == 'day dayActive' || e.target.className == 'day dayActive dayActiveEnd' || e.target.className == 'day dayActive dayActiveStart') {
          this.yearIndex = index;

          var day = this.years[this.yearIndex].dateYear[this.monthIndex].days[this.dayIndex].day;
          var month = this.years[this.yearIndex].dateYear[this.monthIndex].month;
          var year = this.years[this.yearIndex].dateYear[this.monthIndex].year;

          if (day == '今天') {
            day = this.jintian;
          }
          var selTime = year + '-' + month + '-' + day;
          this.selTime = selTime;

          if (this.click == 'one') {
            this.startTime = selTime;
            this.click = 'two';
            this.toastInfo = this.toastInfoArr[1];
            this.addStartText(this.dayEvent, this.dayIndex);

            var day3 = new Date(Date.parse(new Date(this.startTime)) + 30 * 24 * 60 * 60 * 1000);
            day3 = day3.getFullYear() + "-" + this.num9((day3.getMonth() + 1)) + "-" + this.num9(day3.getDate());
            this.max = day3;
            this.init();


          } else if (this.click == 'two') {
            var selTimeCuo = Date.parse(new Date(selTime));
            var startTime = Date.parse(new Date(this.startTime));
            if (selTimeCuo >= startTime) {
              this.endTime = selTime;
              this.toastInfo = this.toastInfoArr[0];
              this.click = 'one';
//              this.$router.go(-1);
              this.addEndText(this.dayEvent, this.dayIndex);
            } else {
              this.startTime = selTime;
              this.addStartText(this.dayEvent, this.dayIndex);

              var day3 = new Date(Date.parse(new Date(this.startTime)) + 30 * 24 * 60 * 60 * 1000);
              day3 = day3.getFullYear() + "-" + this.num9((day3.getMonth() + 1)) + "-" + this.num9(day3.getDate());
              this.max = day3;
              this.init();
            }
          }

          this.toastShow = false;

          var that = this;
          setTimeout(function () {
            that.toastShow = true;
          }, 1000);


          var date = {
            startTime: this.startTime,
            endTime: this.endTime,
            /* startEvent:this.startEvent,
             startIndex:this.startIndex,
             endEvent:this.endEvent,
             endIndex:this.endIndex,*/
          };

          this.$emit('yearClick', date);

        }
      },
      monthClick(e, index){
        this.monthIndex = index;
      },
      dayClick(e, index){
        if (e.target.className == 'day no') {
          return
        } else {
          this.dayIndex = index;
          this.dayEvent = e;
        }
      },
      addStartText(e, index){
        var end = document.querySelector('.tipDivEnd');
        if (end != null) end.parentNode.removeChild(end);


        var my = document.querySelector('.tipDivStart');
        if (my != null) my.parentNode.removeChild(my);
        var jj = document.querySelectorAll('.day');
        for (var i = 0; i < jj.length; i++) {
          if (jj[i].className == 'day no') {

          } else {
            jj[i].className = 'day'
          }
        }

        e.target.className = 'day dayActive dayActiveStart';
        this.dayIndex = index;

        if (e.target.innerText == '') {
          e.target.className = 'day dayKong'
        }

        var tipDivStart = document.createElement("div");
        tipDivStart.innerText = this.tipDivTextStart;

        e.target.appendChild(tipDivStart);

        tipDivStart.className = 'tipDivStart';
        tipDivStart.style.backgroundColor = '#0094db';
        tipDivStart.style.lineHeight = '1.25rem';
      },
      addEndText(e, index){

        var my = document.querySelector('.tipDivEnd');
        if (my != null) my.parentNode.removeChild(my);
        var dayActiveEnd = document.querySelectorAll('.dayActiveEnd');
        if (dayActiveEnd.length != 0) {
          dayActiveEnd[0].className = 'day';
        }
        var jj = document.querySelectorAll('.tipDivEnd');
        for (var i = 0; i < jj.length; i++) {
          if (jj[i].className == 'day no') {

          } else {
            jj[i].className = 'day'
          }
        }
        e.target.className = 'day dayActive dayActiveEnd';
        this.dayIndex = index;

        if (e.target.innerText == '') {
          e.target.className = 'day dayKong'
        }

        var tipDivEnd = document.createElement("div");
        tipDivEnd.innerText = this.tipDivTextEnd;

        e.target.appendChild(tipDivEnd);

        tipDivEnd.className = 'tipDivEnd';
        tipDivEnd.style.backgroundColor = '#0094db';
        tipDivEnd.style.lineHeight = '1rem';
//        this.$router.go(-1);
        var msg = {
          startTime: this.startTime,
          endTime: this.endTime,
        };

        this.$emit('dateClick', msg);


      },
      updateEnd(){


      },
      updateStart(){
        this.upOpen = false;
        /*===========*/
        var end = document.querySelector('.tipDivEnd');
        if (end != null) end.parentNode.removeChild(end);


        var my = document.querySelector('.tipDivStart');
        if (my != null) my.parentNode.removeChild(my);


        var target = this.start;
        var jinTime = currentYear + '-' + currentMonth + '-' + '今天';
        var currentTime = currentYear + '-' + currentMonth + '-' + currentDate;
        if (this.start != '') {
          for (var i = 0; i < this.$refs.day.length; i++) {
            if (currentTime == target && this.$refs.day[i].attributes.time.nodeValue == jinTime) {//今天

              var e = this.$refs.day[i];
              e.className = 'day dayActive dayActiveStart';
              var tipDiv = document.createElement("div");
              tipDiv.innerText = this.tipDivTextStart;
              e.appendChild(tipDiv);

              tipDiv.className = 'tipDivStart';
              tipDiv.style.backgroundColor = '#0094db';
              tipDiv.style.lineHeight = '1rem';


            } else if (this.$refs.day[i].attributes.time.nodeValue == target) {
              var e = this.$refs.day[i];
              e.className = 'day dayActive dayActiveStart';
              var tipDiv = document.createElement("div");
              tipDiv.innerText = this.tipDivTextStart;
              e.appendChild(tipDiv);

              tipDiv.className = 'tipDivStart';
              tipDiv.style.backgroundColor = '#0094db';
              tipDiv.style.lineHeight = '1rem';
            }


          }
        } else {
          for (var i = 0; i < this.$refs.day.length; i++) {
            if (this.$refs.day[i].attributes.time.nodeValue == jinTime) {
              var e = this.$refs.day[i];
              e.className = 'day dayActive dayActiveStart';
              var tipDiv = document.createElement("div");
              tipDiv.innerText = this.tipDivTextStart;
              e.appendChild(tipDiv);

              tipDiv.className = 'tipDivStart';
              tipDiv.style.backgroundColor = '#0094db';
              tipDiv.style.lineHeight = '1rem';
            }
          }
        }


        /*=========================*/
        var targetEnd = this.end;
        var tomorrow = this.tomorrow();

        if (this.end != '') {
          for (var i = 0; i < this.$refs.day.length; i++) {
            if (this.$refs.day[i].attributes.time.nodeValue == targetEnd) {
              var e = this.$refs.day[i];
              e.className = 'day dayActive dayActiveEnd';
              var tipDiv = document.createElement("div");
              tipDiv.innerText = this.tipDivTextEnd;
              e.appendChild(tipDiv);

              tipDiv.className = 'tipDivEnd';
              tipDiv.style.backgroundColor = '#0094db';
              tipDiv.style.lineHeight = '1rem';
            }


          }
        } else {
          for (var i = 0; i < this.$refs.day.length; i++) {
            if (this.$refs.day[i].attributes.time.nodeValue == tomorrow) {
              var e = this.$refs.day[i];
              e.className = 'day dayActive dayActiveEnd';
              var tipDiv = document.createElement("div");
              tipDiv.innerText = this.tipDivTextEnd;
              e.appendChild(tipDiv);

              tipDiv.className = 'tipDivEnd';
              tipDiv.style.backgroundColor = '#0094db';
              tipDiv.style.lineHeight = '1rem';
            }
          }
        }
        /*==============*/


      },
      dayClickEnd(){
      },
      dateBack(){
        this.$emit('dateBack');
      },
      centerClick(){
        this.$emit('rightClick');
      },
      rightClick(){
        this.$emit('rightClick');
      },
      tomorrow(){
        var day3 = new Date();
        day3.setTime(day3.getTime() + 24 * 60 * 60 * 1000);
        var s3 = day3.getFullYear() + "-" + this.num9((day3.getMonth() + 1)) + "-" + this.num9(day3.getDate());
        return s3
      },
      init(){
        //设置模糊高度
        /*   var section = document.querySelector('.myDatePicker');
         var h = document.body.clientHeight;
         //      var h = document.documentElement.clientHeight;
         section.style.height = h + 'px';*/


        var minYear = parseInt(this.min.substring(0, 4));
        var minMonth = parseInt(this.min.substring(5, 7));
        var minDay = parseInt(this.min.substring(8, 10));
        var maxYear = parseInt(this.max.substring(0, 4));
        var maxMonth = parseInt(this.max.substring(5, 7));
        var maxDay = parseInt(this.max.substring(8, 10));
        var yearLength = maxYear - minYear + 1;


        var years = [];


        for (var n = 0; n < yearLength; n++) {
          var yearJson = {
            dateYear: [
              {
                year: minYear + n,
                month: '01',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '02',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'},]
              },
              {
                year: minYear + n,
                month: '03',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '04',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'},]
              },
              {
                year: minYear + n,
                month: '05',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '06',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'},]
              },
              {
                year: minYear + n,
                month: '07',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '08',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '09',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'},]
              },
              {
                year: minYear + n,
                month: '10',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              },
              {
                year: minYear + n,
                month: '11',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'},]
              },
              {
                year: minYear + n,
                month: '12',
                days: [{day: '01'}, {day: '02'}, {day: '03'}, {day: '04'}, {day: '05'}, {day: '06'}, {day: '07'}, {day: '08'}, {day: '09'}, {day: '10'}, {day: '11'}, {day: '12'}, {day: '13'}, {day: '14'}, {day: '15'}, {day: '16'}, {day: '17'}, {day: '18'}, {day: '19'}, {day: '20'}, {day: '21'}, {day: '22'}, {day: '23'}, {day: '24'}, {day: '25'}, {day: '26'}, {day: '27'}, {day: '28'}, {day: '29'}, {day: '30'}, {day: '31'}]
              }
            ],
            year: minYear + n
          };
          years.push(yearJson);
        }

        var json29 = {day: '29'};
        for (var i = 0; i < years.length; i++) {
          var year = years[i].year;
          if ((year % 4 == 0) && (year % 100 != 0) || (year % 400 == 0)) {
            years[i].dateYear[1].days.push(json29);
          } else {
          }
        }

        var json0 = {day: '', kong: true};
        for (var i = 0; i < years.length; i++) {
          for (var j = 0; j < years[i].dateYear.length; j++) {
            var time = years[i].dateYear[j].year + '-' + years[i].dateYear[j].month + '-' + years[i].dateYear[j].days[0].day;
            var week = new Date(time).getDay();
            for (var k = 0; k < week; k++) {
              years[i].dateYear[j].days.unshift(json0);
            }

          }
        }

        if (yearLength == 1) {
          var jj = years[0].dateYear.slice(minMonth - 1, maxMonth);

          years[0].dateYear = jj;


        } else if (yearLength > 1) {
          years[0].dateYear.splice(0, minMonth - 1);
          years[yearLength - 1].dateYear.splice(maxMonth);
        }


        if (yearLength == 1) {
          maxMonth = maxMonth - minMonth + 1
        }


        var minMonthLength = years[0].dateYear[0].days.length;
        var minDayKong = 0;

        for (var i = 0; i < minMonthLength; i++) {
          if (years[0].dateYear[0].days[i].kong == true) {
            minDayKong++;
          }
        }
        var minDayCut = minDayKong + minDay;
        for (var i = 0; i < minDayCut - 1; i++) {
          years[0].dateYear[0].days[i].no = true;
        }


        var maxMonthLength = years[yearLength - 1].dateYear[maxMonth - 1].days.length;

        var maxDayKong = 0;

        for (var i = 0; i < maxMonthLength; i++) {
          if (years[yearLength - 1].dateYear[maxMonth - 1].days[i].kong == true) {
            maxDayKong++;
          }
        }
        var maxDayCut = maxDayKong + maxDay;
        for (var i = maxMonthLength - 1; i > maxDayCut - 1; i--) {
          years[yearLength - 1].dateYear[maxMonth - 1].days[i].no = true;
        }

        if (parseInt(currentMonth) == parseInt(minMonth)) {
          this.jintian = currentDate;
          var currentMonthTime = currentYear + '/' + currentMonth + '/' + '01';
          currentMinWeek = new Date(currentMonthTime).getDay();
          years[0].dateYear[0].days[parseInt(currentDate) + currentMinWeek - 1].day = '今天';
        }

        this.years = years;
      },
    },
    mounted(){
      var max = this.maxProp;
      this.max = max;
      this.toastInfo = this.toastInfoArr[0];
      this.init()
    },
    computed: {},
    components: {},
    updated(){
//      this.$emit('yearClick', this.openTime);

      /* var currentDayDiv = document.querySelectorAll('.day');

       currentDayDiv[currentDate - 1 + currentMinWeek].className = 'day dayActive dayJintian';*/

      if (this.upOpen) {
        this.updateStart();
      }


    }
  }


</script>
